<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no,user-scalable=no,maximum-scale=1">
    <title>Examples • Animation</title>
    <script src="https://aframe.io/releases/1.0.3/aframe.min.js"></script>
    <script src="../bundle.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/feiss/aframe-environment-component@master/dist/aframe-environment-component.min.js"></script>
  </head>
  <body>
    <a-scene environment="preset: checkerboard">
      <!-- Player -->
      <a-entity id="rig" movement-controls position="0 0 5">
        <a-entity id="camera"
                  camera
                  position="0 1.6 0"
                  look-controls="pointerLockEnabled: true"></a-entity>
      </a-entity>

      <!-- Animation
           See: http://threejs.org/examples/#webgl_animation_scene
      -->
      <a-entity position="0 1 0"
                animation-mixer="clip: *;"
                gltf-model="src: url(https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/AnimatedMorphSphere/glTF/AnimatedMorphSphere.gltf);">
      </a-entity>
    </a-scene>
  </body>
</html>
